<template>
  <inline-Modal :visible="visible" :title="title" @cancel="$emit('cancel')" >
    <template slot="button">
      <a-button @click="() => {$emit('cancel')}">关闭</a-button>
    </template>
    <div style="height: calc(100% - 20px);">
      <Monaco ref="monaco" :data="monacoData" width="100%" language="json" :opts="{theme:'vs'}"
              height='100%'></Monaco>
    </div>
  </inline-Modal>
</template>

<script>
  import {Monaco} from "@/components";

  export default {
    name: "preview",
    props: {
      visible: {
        type: Boolean,
        required: true,
      },
      model: {
        type: Object,
        default: () => null,
      },
    },
    components: {
      Monaco
    },
    data() {
      return {
        title: '数据预览',
        monacoData: '',
      }
    },
    mounted() {
    },
  }
</script>

<style lang="less" scoped>
  /deep/.modal-full-layout .main{
    overflow:unset !important;
  }
</style>
